<template>
  <div class="home">
    <el-container>
      <el-aside width="auto">
        <Menu></Menu>
      </el-aside>
      <el-container>
        <el-header>
          <Header />
        </el-header>
        <el-main>
          <Tag />
          <router-view />
        </el-main>
      </el-container>
    </el-container>
  </div>
</template>

<script>
import Menu from '@/components/Menu'
import Header from '@/components/Header'
import Tag from '@/components/Tag'
import { mapState } from 'vuex'
export default {
  name: "Home",
  data () {
    return {}
  },
  computed: {
    ...mapState({
      isCollapse: state => state.tabs.isCollapse
    })
  },
  components: {
    Menu,
    Header,
    Tag
  }
}
</script>
<style lang="less" scoped>
@import url('../assets/css/base.less');

.home {
  .el-container {
    height: 100%;
  }
  height: 100%;
  .el-header {
    background-color: @theme-color;
  }

  .el-main {
    background-color: #eee;
  }
}
</style>
